<!--
This is your default homepage.
For more information, see:
• https://sailsjs.com/documentation/concepts/views
• https://sailsjs.com/documentation/concepts/routes
-->
<link href="https://fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet">
<style>
HTML {HEIGHT: 100%}
BODY { HEIGHT: 100%;MARGIN: 0px; FONT: 12px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica; BACKGROUND-COLOR: #d9dee2}
#login {PADDING-RIGHT: 30px; PADDING-LEFT: 30px; LEFT: 50%; PADDING-BOTTOM: 30px; MARGIN: -150px 0px 0px -230px; WIDTH: 400px; PADDING-TOP: 30px; POSITION: absolute; TOP: 50%; HEIGHT: 240px; BACKGROUND-COLOR: #fff; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.2),
          0 1px 1px rgba(0, 0, 0, .2),
          0 3px 0 #fff,
          0 4px 0 rgba(0, 0, 0, .2),
          0 6px 0 #fff,  
          0 7px 0 rgba(0, 0, 0, .2); -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.2),  
          1px 1px   0 rgba(0,   0,   0,   .1),
          3px 3px   0 rgba(255, 255, 255, 1),
          4px 4px   0 rgba(0,   0,   0,   .1),
          6px 6px   0 rgba(255, 255, 255, 1),  
          7px 7px   0 rgba(0,   0,   0,   .1); box-shadow: 0 0 2px rgba(0, 0, 0, 0.2),  
          0 1px 1px rgba(0, 0, 0, .2),
          0 3px 0 #fff,
          0 4px 0 rgba(0, 0, 0, .2),
          0 6px 0 #fff,  
          0 7px 0 rgba(0, 0, 0, .2)
}
#login:unknown {
    BORDER-RIGHT: #ccc 1px dashed; BORDER-TOP: #ccc 1px dashed; Z-INDEX: -1; RIGHT: 5px; LEFT: 5px; BORDER-LEFT: #ccc 1px dashed; BOTTOM: 5px; BORDER-BOTTOM: #ccc 1px dashed; POSITION: absolute; TOP: 5px; -webkit-box-shadow: 0 0 0 1px #fff; -moz-box-shadow: 0 0 0 1px #fff; box-shadow: 0 0 0 1px #fff; content: ''
}
H1 {MARGIN: 0px 0px 30px; FONT: 26px/1 Verdana, Helvetica; TEXT-TRANSFORM: uppercase; COLOR: #666; LETTER-SPACING: 4px; POSITION: relative; TEXT-ALIGN: center; }
.fieldset { BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px}
#inputs INPUT {BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #ccc 1px solid; PADDING-LEFT: 30px; BACKGROUND: url(/images/login-sprite.png) #f1f1f1 no-repeat; PADDING-BOTTOM: 15px; MARGIN: 0px 0px 10px; BORDER-LEFT: #ccc 1px solid; WIDTH: 353px; PADDING-TOP: 15px; BORDER-BOTTOM: #ccc 1px solid; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff; -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff; box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff}
#username {BACKGROUND-POSITION: 5px -2px}
#inputs INPUT:focus {BORDER-LEFT-COLOR: #e8c291; BORDER-BOTTOM-COLOR: #e8c291; BORDER-TOP-COLOR: #e8c291; BACKGROUND-COLOR: #fff; BORDER-RIGHT-COLOR: #e8c291; -webkit-box-shadow: 0 0 0 1px #e8c291 inset; -moz-box-shadow: 0 0 0 1px #e8c291 inset; box-shadow: 0 0 0 1px #e8c291 inset; outline: none}
#actions {MARGIN: 25px 0px 0px}
#submit {BORDER-RIGHT: #e3a037 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #d69e31 1px solid; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; FONT: bold 15px Arial, Helvetica; BORDER-LEFT: #e3a037 1px solid; WIDTH: 120px; CURSOR: pointer; COLOR: #8f5a0a; PADDING-TOP: 0px; BORDER-BOTTOM: #d5982d 1px solid; HEIGHT: 35px; BACKGROUND-COLOR: #ffb94b; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset; -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset; box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset; text-shadow: 0 1px 0 rgba(255,255,255,0.5)}
#submit:hover { BACKGROUND-COLOR: #fddb6f}
#submit:focus {BACKGROUND-COLOR: #fddb6f}
#submit:active {-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; outline: none}
#submit:unknown {BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none}
#actions A {MARGIN-LEFT: 10px; COLOR: #3151a2; LINE-HEIGHT: 35px;font-size: 18px;}
#back {DISPLAY: block; COLOR: #999; POSITION: relative; TOP: 60px; TEXT-ALIGN: center}
label.error {border: 0px solid red;color: red;}
label.error {background: url(/images/ico_error_16.gif) no-repeat 0% 50%;color: red;font-weight: 700;padding-left: 20px;}
#password { BACKGROUND-POSITION: 5px -52px}
</style>

<div id="login" method="post" action="#">
  <h1>用户登录</h1>
  <div class="fieldset" id="inputs">
      <input id="login_name"  name="managername" placeholder="请输入登录名" validate="required:true" value="" title="请输入登录名" style="BACKGROUND-POSITION: 5px -2px"> 
      <input id="password" type=password placeholder="请输入登录密码" name="loginpassword" validate="required:true" value="" title="请输入密码" style="BACKGROUND-POSITION: 5px -52px"> 
  </div> 
  <div class="fieldset" id="actions">
     <input id="submit" type="button" value="登录"> 
     <a href="/register" target="_blank">注册</a>
  </div> 
</div>

<script type="text/javascript" src="/js/jquery-3.7.0.min.js"></script>
<script>
$(function(){
  $("#login_name").on("keyup",() => {
    $("#login_name").val($("#login_name").val().replace(" ",""))
  })

  $("#password").on("keyup",() => {
    $("#password").val($("#password").val().replace(" ",""))
  })

	$("#submit").click(function(){
		var loginName = $("#login_name").val();
    if(loginName == null || loginName == "" || loginName == undefined){
      alert("登录名不能为空！")
      $("#loginName").focus();
      return;
    }

    var password = $("#password").val();
    if(password == null || password == "" || password == undefined){
      alert("密码不能为空！")
      $("#password").focus();
      return;
    }

    $.ajax({
			url:"/myuser/login",
			data:{"loginName":loginName,"password":password},
			type:"post",
			dataType:"text",
			success:function(data){
				if("success" == data){
					window.location.href = "/myuser/main_page";
				}else if("error_user" == data) {
          alert("您所输入的账号或密码有误！");
        }else if("fail" == data){
					alert("登录失败！");
				}else if("exception" == data){
					alert("登录异常！");
				}else{
					alert("登录情况未知！");
				}
			}
		});
	});
});
</script>